<template>
  <Form
    ref="financialForm"
    :model="form"
    :rules="rules"
    @keydown.enter.native="handleSubmit"
    inline
    :label-width="85">
    <FormItem v-if="title === '财务管理佣金统计' || title === '财务管理服务费统计'" prop="ctime" style="width: 250px" label="交易日期：">
      <DatePicker v-model="form.ctime" type="date" placeholder="请选择交易日期"></DatePicker>
    </FormItem>
    <FormItem v-if="title === '财务管理签约统计'" prop="orderdate" style="width: 250px" label="签约日期：">
      <DatePicker v-model="form.orderdate" type="date" placeholder="请选择签约日期"></DatePicker>
    </FormItem>
    <!-- <FormItem v-if="title === '财务管理佣金统计'" prop="coludname" style="width: 250px" label="云销售姓名：">
      <Input type="text" v-model="form.coludname" placeholder="请输入云销售姓名" />
    </FormItem> -->
    <!-- <FormItem v-if="title === '财务管理佣金统计'" prop="type0" label="结算方式：" style="width: 250px">
      <Select v-model="form.type0" clearable>
        <Option value="all">
          全部
        </Option>
        <Option value="0">
          佣金充值
        </Option>
        <Option value="1">
          到店结算
        </Option>
        <Option value="2">
          成交结算
        </Option>
      </Select>
    </FormItem>
    <FormItem v-if="title === '财务管理服务费统计'" prop="type0" label="结算方式：" style="width: 250px">
      <Select v-model="form.type0">
        <Option value="all">
          全部
        </Option>
        <Option value="0">
          服务费充值
        </Option>
        <Option value="1">
          短信发送
        </Option>
      </Select>
    </FormItem> -->
    <!-- <FormItem v-if="title === '财务管理财务流水' || title === '财务管理签约统计'" prop="type" label="消费类型：" style="width: 250px">
      <Select v-model="form.type">
        <Option value="all">
          全部
        </Option>
        <Option value="0">
          佣金充值
        </Option>
        <Option value="1">
          服务费充值
        </Option>
        <Option value="2">
          短信发送费用
        </Option>
        <Option value="3">
          口碑结算
        </Option>
        <Option value="4">
          到店结算
        </Option>
        <Option value="5">
          成交结算
        </Option>
      </Select>
    </FormItem> -->
    <FormItem style="float: right;">
      <Button @click="handleSubmit" icon="md-search" type="primary">
        搜索
      </Button>
    </FormItem>
  </Form>
</template>
<script>
import {
  mapState,
  mapActions,
  mapMutations
} from 'vuex'
export default {
  name: 'FinancialForm',
  props: {
    title: '',
    ctimeRules: {
      type: Array,
      default: () => {
        return []
      }
    },
    typeRules: {
      type: Array,
      default: () => {
        return []
      }
    },
    coludnameRules: {
      type: Array,
      default: () => {
        return []
      }
    }
  },
  data () {
    return {
      form: {
        ctime: '',
        orderdate: '',
        // coludname: '',
        type0: 'all'
      }
    }
  },
  computed: {
    rules () {
      return {
        ctime: this.ctimeRules,
        // coludname: this.coludnameRules,
        type0: this.typeRules
      }
    }
  },
  methods: {
    handleSubmit () {
      this.$refs.financialForm.validate((valid) => {
        if (valid) {
          this.$emit('on-success-valid', {
            ctime: this.form.ctime ? this.$moment(this.form.ctime).format('YYYY-MM-DD') : '',
            orderdate: this.form.orderdate ? this.$moment(this.form.orderdate).format('YYYY-MM-DD') : ''
            // coludname: this.form.coludname,
            // type0: this.form.type0 && this.form.type0 !== 'all' ? parseInt(this.form.type0) : ''
          })
        }
      })
    }
  }
}
</script>
